<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="20">
            <a-row>
              <a-col :span="8">
                <a-form-model-item label="员工编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="employeeCode">
                  <a-input v-model="model.employeeCode" placeholder="请输入员工编号"></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="8">
                <a-form-model-item label="籍贯" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="birthplace">
                  <a-input v-model="model.birthplace" placeholder="请输入籍贯"></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="8">
                <a-form-model-item label="婚姻状况" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="marriageStatus">
                  <j-dict-select-tag
                    type="list"
                    v-model="model.marriageStatus"
                    dictCode="marriage_status"
                    placeholder="请选择婚姻状况"
                  />
                </a-form-model-item>
              </a-col>
            </a-row>
            <a-row>
              <a-col :span="8">
                <a-form-model-item label="员工姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="employeeName">
                  <a-input v-model="model.employeeName" placeholder="请输入员工姓名"></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="8">
                <a-form-model-item label="曾用名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="previousName">
                  <a-input v-model="model.previousName" placeholder="请输入曾用名"></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="4">
                <a-form-model-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="sex">
                  <j-dict-select-tag type="list" v-model="model.sex" dictCode="sex" placeholder="请选择性别" />
                </a-form-model-item>
              </a-col>
              <a-col :span="4">
                <a-form-model-item label="民族" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="nation">
                  <a-input v-model="model.nation" placeholder="请输入民族"></a-input>
                </a-form-model-item>
              </a-col>
            </a-row>
          </a-col>
          <a-col :span="4">
            <j-image-upload text="照片" v-model="model.photo" :isMultiple="false"></j-image-upload>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <a-form-model-item label="年龄" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="age">
              <a-input-number v-model="model.age" placeholder="请输入年龄" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="出生日期" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="birthDate">
              <j-date placeholder="请选择出生日期" v-model="model.birthDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="身份证号" :labelCol="labelColSingle" :wrapperCol="wrapperCol" prop="idCard">
              <a-input v-model="model.idCard" placeholder="请输入身份证号"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="家庭住址" :labelCol="labelColSingle" :wrapperCol="wrapperCol" prop="address">
              <a-input v-model="model.address" placeholder="请输入家庭住址"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="户口所在地" :labelCol="labelColSingle" :wrapperCol="wrapperCol" prop="registerLocation">
              <a-input v-model="model.registerLocation" placeholder="请输入户口所在地"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <a-form-model-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="telephone">
              <a-input v-model="model.telephone" placeholder="请输入手机号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="QQ" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="qqCode">
              <a-input v-model="model.qqCode" placeholder="请输入QQ"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="电子邮件" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="email">
              <a-input v-model="model.email" placeholder="请输入电子邮件"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="办公电话" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="officeCall">
              <a-input v-model="model.officeCall" placeholder="请输入办公电话"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="学历" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="educationBackground">
              <j-dict-select-tag
                type="list"
                v-model="model.educationBackground"
                dictCode="education_background"
                placeholder="请选择学历"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="毕业院校" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="graduatedFrom">
              <a-input v-model="model.graduatedFrom" placeholder="请输入毕业院校"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="专业" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="major">
              <a-input v-model="model.major" placeholder="请输入专业"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="duties">
              <a-input v-model="model.duties" placeholder="请输入职务"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="所属部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="departCode">
              <j-select-depart v-model="model.departCode" :multi="false" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="岗位" :labelCol="labelColSingle" :wrapperCol="wrapperCol" prop="post">
              <j-select-position v-model="model.post" :multi="false" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item
              label="参加工作时间"
              :labelCol="labelColLong"
              :wrapperCol="wrapperCol"
              prop="firstJobDate"
            >
              <j-date placeholder="请选择参加工作时间" v-model="model.firstJobDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="入职时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="entryDate">
              <j-date placeholder="请选择入职时间" v-model="model.entryDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="合同类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contractType">
              <j-dict-select-tag
                type="list"
                v-model="model.contractType"
                dictCode="employee_contract_type"
                placeholder="请选择合同类型"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item
              label="合同开始日期"
              :labelCol="labelColLong"
              :wrapperCol="wrapperCol"
              prop="contractStartDate"
            >
              <j-date placeholder="请选择合同开始日期" v-model="model.contractStartDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item
              label="合同终止日期"
              :labelCol="labelColLong"
              :wrapperCol="wrapperCol"
              prop="contractEndDate"
            >
              <j-date placeholder="请选择合同终止日期" v-model="model.contractEndDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-row>
          <a-col :span="6">
            <a-form-model-item label="固定工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="fixedSalary">
              <a-input-number v-model="model.fixedSalary" placeholder="请输入固定工资" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="绩效工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="performanceSalary">
              <a-input-number v-model="model.performanceSalary" placeholder="请输入绩效工资" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="考勤编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="attenceCode">
              <a-input v-model="model.attenceCode" placeholder="请输入考勤编号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="银行卡号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bankCardCode">
              <a-input v-model="model.bankCardCode" placeholder="请输入银行卡号"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="6">
            <a-form-model-item
              label="公司参保时间"
              :labelCol="labelColLong"
              :wrapperCol="wrapperCol"
              prop="insuranceDate"
            >
              <j-date placeholder="请选择公司参保时间" v-model="model.insuranceDate" style="width: 100%" />
            </a-form-model-item>
          </a-col>

          <a-col :span="6">
            <a-form-model-item label="参保类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="insuranceType">
              <j-dict-select-tag
                type="list"
                v-model="model.insuranceType"
                dictCode="insurance_type"
                placeholder="请选择参保类型"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="档案号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="fileCode">
              <a-input v-model="model.fileCode" placeholder="请输入档案号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="意外" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="accident">
              <j-dict-select-tag type="list" v-model="model.accident" dictCode="accident_pay" placeholder="请选择" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="风险金" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="riskPay">
              <j-dict-select-tag type="list" v-model="model.riskPay" dictCode="risk_pay" placeholder="请选择" />
            </a-form-model-item>
          </a-col>
          <a-col :span="6">
            <a-form-model-item label="工龄工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="seniorityWage">
              <a-input-number v-model="model.seniorityWage" placeholder="请输入工龄工资" style="width: 100%" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-form-model-item label="保险说明" :labelCol="labelColSingle" :wrapperCol="wrapperCol" prop="socialInsurance">
          <a-input v-model="model.socialInsurance" placeholder="请输入保险说明"></a-input>
        </a-form-model-item>
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="证书取得" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="certificates">
              <a-textarea v-model="model.certificates" rows="4" placeholder="请输入证书取得" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="工作经历" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workExperience">
              <a-textarea v-model="model.workExperience" rows="4" placeholder="请输入工作经历" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-model-item
              label="学习经历"
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              prop="educationExperience"
            >
              <a-textarea v-model="model.educationExperience" rows="4" placeholder="请输入学习经历" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remark">
              <a-textarea v-model="model.remark" rows="4" placeholder="请输入备注" />
            </a-form-model-item>
          </a-col>
        </a-row>

        <a-divider>附件上传</a-divider>
        <a-row>
          <a-col :span="24">
            <j-upload v-model="model.attachment" text="附件列表"></j-upload>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>
import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'
export default {
  name: 'TslHrEmployeeInfoForm',
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
  },
  data() {
    return {
      model: {},
      labelColSingle: {
        xs: { span: 24 },
        sm: { span: 3 },
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      labelColLong: {
        xs: { span: 24 },
        sm: { span: 8 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
        departCode: [{ required: true, message: '请输入所属部门!' }],
        employeeCode: [{ required: true, message: '请输入员工编号!' }],
        employeeName: [{ required: true, message: '请输入员工姓名!' }],
        telephone: [{ pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号码!' }],
        email: [{ pattern: /^([\w]+\.*)([\w]+)@[\w]+\.\w{3}(\.\w{2}|)$/, message: '请输入正确的电子邮件!' }],
        contractType: [{ required: true, message: '请输入合同类型!' }],
        riskPay: [{ required: true, message: '请输入风险金!' }],
      },
      url: {
        add: '/hr/tslHrEmployeeInfo/add',
        edit: '/hr/tslHrEmployeeInfo/edit',
        queryById: '/hr/tslHrEmployeeInfo/queryById',
      },
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
    add() {
      this.edit(this.modelDefault)
    },
    edit(record) {
      this.model = Object.assign({}, record)
      this.visible = true
    },
    submitForm() {
      const that = this
      // 触发表单验证
      this.$refs.form.validate((valid) => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          httpAction(httpurl, this.model, method)
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
            })
        }
      })
    },
  },
}
</script>
